<template>
  <div id="app">
    <Header :user="currentUser"></Header>
    <router-view @login="handleLogin" @logout="handleLogout"></router-view>
  </div>
</template>

<script>
import Header from './components/Header.vue'

export default {
  name: 'App',
  components: {
    Header
  },
  data() {
    return {
      currentUser: null, // 当前用户角色
    }
  },
  methods: {
    handleLogin(userRole) {
      this.currentUser = userRole;
    },
    handleLogout(){
      this.currentUser = null
    }
  }

}
</script>

<style>
body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background-color: #7bb1c9;
}
</style>
